<template>
	<view class="pagesbg">
		<!-- 头部 -->
		<view class="header_bar header_fixed header_main">
			<view class="header">
				<view class="header-goBack" @tap.stop="$tools.back(1)"></view>
				<view class="header-title">兑换记录</view>
			</view> 
		</view> 
		
		<view class="">
			<view class="record">
				<view class="record-wrapper" v-if="isShowPage">
					<!--  -->
						<view class="record-bg" v-for="(item,index) in recordsList" :key="index"
						v-if="recordsList.length != 0">	
							<view class="record-item">
								<view class="record-left">
									<view class="record-text">兑换数量：{{ item.amount }}消费券</view>
									<view class="record-text">手续费：{{ item.fee ? item.fee : 0 }} UN</view>
									<view class="record-text">到账数量：{{ item.toAmount ? item.toAmount : 0 }} UN</view>
								</view>
								<view class="record-right">
									<view class="record-none">1</view>
									<view class="record-none">1</view>
									<view class="record-none">1</view>
								</view>
							</view>
							<view class="record-timeBox">
								<view class="record-time">发起时间：{{ item.createTime }}</view>
							</view>
						</view>
					<view class="initNoData" v-if="recordsList.length == 0">暂无记录</view>
				</view>
			</view>
		</view>
		
	</view>
</template>

<script>
	export default {
		components:{
		},
		data(){
			return{
				isShowPage: false,
				pages: 1,
				pageIndex: 1,
				pageSize: 20,
				recordsList: [],
			}
		},
		computed: {
			getWithdrawalType(){
				return function(type){
					switch (type){
						case 1:
							return '微信';
							break;
						case 2:
							return '支付宝';
							break;
						case 3:
							return '银行卡';
							break;
					}
				}
			}
		},
		onLoad() {
			
		},
		onShow() {
			this.init();
		},
		onReachBottom() {
			console.log("ddd");
			if (this.pageIndex >= this.pages) {
				return this.$tools.toast('到底了');
			} else {
				this.pageIndex++;
				console.log("+++")
				this.getUserExchangeRecord();
			}
		},
		methods: {
			init(){
				this.isShowPage = false;
				this.pages = 1;
				this.pageIndex = 1;
				this.recordsList = [];
				this.getUserExchangeRecord();
			},
			// 兑换记录
			getUserExchangeRecord(){
				var data = {
					pageIndex: this.pageIndex,
					pageSize: this.pageSize,
				};
				console.log("data：",data);
				uni.showLoading({
					mask:true
				})
				this.$Ajax('/api/money/getUserExchangeRecord',data, res => {
						if(res.code == 200){
							this.isShowPage = true;
							this.pages = res.data.pages;
							this.recordsList = this.recordsList.concat(res.data.list);
							uni.hideLoading();
						}
					}, err => {
						uni.hideLoading();
					}, 'GET'
				);
			},
		}
	}
</script>

<style lang="scss" scoped>
	.record{
		&-wrapper{
			padding: 0 32rpx;
		}
		&-bg{
			background: #FFFFFF;
			box-shadow: none;
			border-radius: 16rpx;
		}
		&-item{
			padding: 6rpx 20rpx;
			margin-top: 12rpx;
		}
		&-text{
			margin-top: 36rpx;
		}
		&-status{
			margin-top: 22rpx;
		}
		&-timeBox{
			border-top: 1px solid rgba(216,216,216,0.41);
			margin: 30rpx 20rpx 0;
			padding: 0rpx 0 28rpx;
		}
	}	
	
</style>